import dayjs from 'dayjs';
import { steps } from '../../menus/index';
import { getHospitalList } from '../../model/hospital';
import { validate, NULL_RULES } from '../../utils/validate';
import Dialog from '../../miniprogram_npm/@vant/weapp/dialog/dialog';
import { addOrder } from '../../model/order';

const app = getApp<IAppOption>();

Page({
  /**
   * 页面的初始数据
   */
  data: {
    steps: steps,
    active: 0,
    selectedHospital: null as any,
    hospitalPickerShow: false,
    hospitalList: [] as any[],
    visitor: null as any,
    datetime: '',
    minDatetime: new Date().getTime(),
    maxDatetime: new Date(dayjs().add(2, 'month').format('YYYY-MM-DD hh:mm:ss')).getTime(), // 最长两个月
    showDatetimePicker: false,
    openId: app.globalData.openId,
    agreed: false,
    rules: {
      hosptial_id: [{rule: NULL_RULES, msg: '医院不能为空'}],
      hospital_department: [{rule: NULL_RULES, msg: '科室不能为空'}],
      visiter_time: [{rule: NULL_RULES, msg: '就诊时间不能为空'}],
      visiter_id: [{rule: NULL_RULES, msg: '就诊人不能为空'}],
      contacter_name: [{rule: NULL_RULES, msg: '联系人不能为空'}],
      contacter_phone: [{rule: NULL_RULES, msg: '联系人电话不能为空'}],
      companion_gender: [{rule: NULL_RULES, msg: '陪诊员性别不能为空'}],
    }
  },
  async submitForm(event: any) {
    if (!this.data.agreed) return;

    const form = event.detail.value;
    const data = {
      service_type: form.service_type,
      order_amount: 300,
      hosptial_id: this.data.selectedHospital?.value,
      hosptial_name: this.data.selectedHospital?.label,
      hospital_department: form.hospital_department,
      visiter_time: this.data.datetime,
      visiter_id: this.data.visitor?.id,
      visiter_name: this.data.visitor?.name,
      open_id: this.data.openId,
      contacter_name: form.contacter_name,
      contacter_phone: form.contacter_phone,
      companion_gender: form.companion_gender,
      remark: form.remark
    };

    // 校验参数
    const validateRes = validate(data, this.data.rules);
    if (validateRes) {
      Dialog.alert({
        message: validateRes,
      });
      return;
    }

    const res = await addOrder(data);
    if (res.code === 200) {
      wx.redirectTo({
        url: '/pages/order-detail/order-detail?id=' + res.data
      });
    }
  },
  toServiceNoticeBook() {
    wx.navigateTo({
      url: '/pages/notice/notice'
    });
  },
  toggleAgreed() {
    this.setData({
      agreed: !this.data.agreed
    });
  },
  showDatetimePicker() {
    this.setData({
      showDatetimePicker: true
    });
  },
  closeDatetimePicker() {
    this.setData({
      showDatetimePicker: false
    });
  },
  selectDatetime(event: any) {
    this.setData({
      datetime: dayjs(event.detail).format('YYYY-MM-DD HH:mm:ss'),
      showDatetimePicker: false
    });
  },
  showHospitalPicker() {
    this.setData({
      hospitalPickerShow: true
    });
  },
  closeHospitalPicker() {
    this.setData({
      hospitalPickerShow: false
    });
  },
  selectHospital(event: any) {
    const hospital = event.detail.value;
    this.setData({
      selectedHospital: hospital,
      hospitalPickerShow: false
    });
  },
  selectVisiter() {
    wx.navigateTo({
      url: '/pages/visitor-list/visitor-list?type=select'
    });
  },
  async fetchHospital() {
    const data = await getHospitalList();
    this.setData({
      hospitalList: data.map((h) => {
        return {
          label: h.name,
          value: h.id
        };
      })
    });
  },
  onLoad: async function () {
    this.fetchHospital();
  },
  onShow() {
    const visitor = app.globalData.pageData;
    if (visitor) {
      this.setData({
        visitor
      });
      app.globalData.pageData = undefined;
    }
  }
});
